<template>
  <div>
    <nav-bar
      class="navbar"
      left-arrow
      fixed
      :title="centerText"
      @click-left="onClickLeft"
      @click-right="onClickRight"
    >
      <van-icon v-if="hasRight" name="wap-home" slot="right" size="22px" color="#fff" />
    </nav-bar>
  </div>
</template>
<script >
import { NavBar } from "vant";
export default {
  name: "index",
  data() {
    return {};
  },
  props: {
    centerText: {
      //左侧 文字
      type: String,
      default: "搜索"
    },
    hasRight: {
      //左侧 文字
      type: Boolean,
      default: true
    },
  },
  methods: {
    onClickLeft() {
      this.$router.back(-1)
    },
    onClickRight(){
      this.$router.replace('Index')
    }
  },
  mounted() {},
  components: {
    NavBar
  }
};
</script>
<style scoped lang='less'>
.navbar {
  height: 80px;
  background: #51c20e;
  color: #fff;
  line-height: 80px;
}
.van-nav-bar__title {
  color: #fff;
  font-size: 36px;
  font-weight: 600;
}
</style>
